<template>
<el-dialog title="选择商户" width="700px" :visible.sync="dialogMMCVisible" :close-on-click-modal="false" append-to-body>
  <el-form class="search" label-position="right" label-width="100px">
    <el-row :gutter="40">
      <el-col :span="12">
        <el-form-item label="经营模式：" prop="manage">
          <el-select v-model="MMCparams.manage">
            <el-option v-for="item in businessModelList" :key="item.value" :label="item.label" :value="item.value" />
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="楼层:">
          <el-cascader
            v-model="MMCparams.floors"
            :props="{children:'floors',label:'name', value: 'id'}"
            :options="tree"
          />
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="品牌:">
          <el-input v-model="MMCparams.brandName" />
        </el-form-item>
      </el-col>

      <el-col :span="8" class="mb15">
        <SearchButton :default-params="{}" @refreshParams="refreshMMCparams" @getList="getShopsList" />
      </el-col>
    </el-row>
    <vxe-table
      ref="ShopsTree"
      border
      resizable
      highlight-hover-row
      :auto-resize="true"
      :data="effectiveList"
      width
      max-height="300"
      :print-config="{}"
      row-id="id"
      highlight-current-row
      text-algin="center"
      @radio-change="radioChange"
    >
      <vxe-table-column type="radio" width="60" />
      <vxe-table-column field="brandName" title="品牌" />
      <vxe-table-column field="code" title="商户编码" />

      <vxe-table-column width="150" field="name" title="商户名称" />
      <vxe-table-column width="100" field="floorName" title="楼层" />
      <vxe-table-column width="100" field="formatIdName" title="业态" />
      <vxe-table-column width="100" field="manageName" title="经营方式" />

    </vxe-table>
    <vxe-pager
      :current-page.sync="MMCparams.pageNum"
      :page-size.sync="MMCparams.pageSize"
      :total="MMCTotal"
      :layouts="['PrevJump', 'PrevPage', 'Number', 'NextPage', 'NextJump', 'FullJump', 'Total']"
      @page-change="getShopsList()"
    />
  </el-form>
  <div slot="footer" class="dialog-footer">
    <el-button @click="dialogMMCVisible = false">取 消</el-button>
    <el-button type="primary" @click="shopSubmit">确定</el-button>
  </div>
</el-dialog>
</template>

<script>
import SearchButton from '@/components/SearchButton'
import { getEffectivePageList, searchAllDictionaries } from '@/api/public'
import { getBuildPageList } from '@/api/tenement'

export default {
  components: {
    SearchButton
  },
  props: {
    // dialogTitle: {
    //   type: String,
    //   default: ''
    // },
  },
  data() {
    return {
      dialogMMCVisible:false,
      MMCparams: {
        pageNum: 1,
        pageSize: 20,
        floors: [],
        floor: '',
        brandName: '',
        manage: ''
      },
      MMCTotal: 0,
      tree: [],
      checkDiscountShopIdList: [],
      businessModelList: [],
      effectiveList:[],
      rowNews:{}
    }
  },
  created() {
    this.getShopsList()
    this.getTreeList()
    this.getDicInfo('business_model')
  },
  methods: {
    refreshMMCparams() {
      this.MMCparams = {
        pageNum: 1,
        pageSize: 20,
        floors: [],
        floor: '',
        brandName: '',
        manage: ''
      }
      this.getShopsList()
    },
    getShopsList() {
      this.MMCparams.floor = this.MMCparams.floors.length > 0 ? this.MMCparams.floors[this.MMCparams.floors.length - 1] : ''
      getEffectivePageList(this.MMCparams).then(res => {
        this.effectiveList = res.records
        this.MMCTotal = res.total
      })
    },
    getDicInfo(type) {
      searchAllDictionaries({
        type: type
      }).then(response => {
        if (type === 'business_model') {
          this.businessModelList = response
        } else if (type === 'business_status') {
          this.businessStatusList = response
        } else if (type === 'goods_channel') {
          this.verificationChannelsList = response
        }
      })
    },
    getTreeList() {
      getBuildPageList().then(res => {
        this.tree = [{ floors: null, id: '', name: '全部' }, ...res]
      })
    },
    radioChange(row) {
      this.rowNews = row.row
    },
    shopSubmit() {
      this.dialogMMCVisible = false
      this.$emit('chooseShEnd',this.rowNews)
    },

  }
}
</script>

<style lang="scss" scoped>
</style>
